<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>中关村在线企业购</title>
</head>
<body>
    <link rel="stylesheet" href="/libs/swiper/css/swiper.min.css">
<link rel="stylesheet" href="/css/index.css">
<link rel="shortcut icon" href="/favicon.ico">
<!-- 导航，轮播 -->
<div class="header"></div>

<div class="banner">
    <div class="content">
        <div class="left">
            <ul>
                <li><a href="/html/list.html">笔记本</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">超极本</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">太师电脑</a></li>
                <li><a href="/html/list.html">办公打印</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">投影</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">监控</a>&nbsp;<span>/</span>&nbsp;<a href="">软件</a></li>
                <li><a href="/html/list.html">厨卫电器</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">小家电</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">生活家电</a></li>
                <li><a href="/html/list.html">大家电</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">影视电视</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">游戏机</a></li>
                <li><a href="/html/list.html">手机</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">智能手机</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">通讯产品</a></li>
                <li><a href="/html/list.html">数码产品</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">MP3</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">移动电源</a></li>
                <li><a href="/html/list.html">数码相机</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">单反</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">数码摄像机</a></li>
                <li><a href="/html/list.html">服务器</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">网络</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">无线</a><a href="">布线</a></li>
                <li><a href="/html/list.html">DIY硬件</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">外设</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">模拟暂机</a></li>
                <li><a href="/html/list.html">平板电脑</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">智能穿戴</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">智能家居</a></li>
                <li><a href="/html/list.html">汽车电子</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">电动车</a>&nbsp;<span>/</span>&nbsp;<a href="/html/list.html">代步出行</a></li>
            </ul>
        </div>
        <div class="center">
            <div class="swiper-container">
                <div class="swiper-wrapper">
                    <div class="swiper-slide"><img src="/images/banner1.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="/images/banner2.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="/images/banner3.jpg" alt=""></div>
                    <div class="swiper-slide"><img src="/images/banner4.jpg" alt=""></div>
                </div>
                <!-- 如果需要分页器 -->
                <div class="swiper-pagination"></div>
                
                <!-- 如果需要导航按钮 -->
                <div class="swiper-button-prev"></div>
                <div class="swiper-button-next"></div>
                
                <!-- 如果需要滚动条 -->
                <div class="swiper-scrollbar"></div>
            </div>
        </div>
        <div class="right">
            <div class="top">
                <h5>会员登录</h5>
                <hr>
                <form action="#">
                    <input type="text" placeholder="手机号/邮箱/用户名">
                    <input type="text" placeholder="密码">
                    <button>登录</button>
                    <p><a href="#">忘记密码</a>
                        <a href="#">注册</a></p>
                </form>
            </div>
            <div class="bottom">
                <ul>
                    <li>极速体验</li>
                    <li>优采保障</li>
                    <li>售后无忧</li>
                    <li>专属客服</li>
                </ul>
            </div>
        </div>
    </div>
</div>
<!-- main -->
<main>
    <div class="content">
        <div class="div1">
            <div class="title">
                <h3>热门采购</h3>
                <span>换一批</span>
            </div>
            <ul id="ul1">
                               
            </ul>
            <script type="text/html" id="list1">
                {{each list item}}
                    <li>
                        <a href="/html/detail.html?id={{item.id}}"><img src="{{item.src}}" alt=""></a>
                        <p>{{item.title}}</p>
                        <span>￥{{item.price}}</span>
                        <a href="/html/detail.html?id={{item.id}}"><button>立即采购</button></a>
                    </li>
                {{/each}}
            </script>
        </div>
        <div class="div2">
            <div class="title">
                <h3>办公设备/办公耗材</h3>
                <a href="">办公打印</a>
                <a href="">考勤门禁</a>
                <a href="">系统投影</a>
                <a href="">监控</a>
            </div>
            <div class="left"><img src="/images/list1.PNG" alt=""></div>
            <div class="right">
                <ul id="ul2">    
                </ul>
                <script type="text/html" id="list2">
                    {{each list item}}
                        <li>
                            <a href="/html/detail.html?id={{item.id}}"><img src="{{item.src}}" alt=""></a>
                            <p>{{item.title}}</p>
                            <span>￥{{item.price}}</span>
                        </li>
                    {{/each}}
                </script>
            </div>
        </div>
        <div class="div3">
            <div class="title">
                <h3>电脑/数码</h3>
                <a href="">台式整机</a>
                <a href="">笔记本</a>
                <a href="">数码产品</a>
            </div>
            <div class="left"><img src="/images/list2.PNG" alt=""></div>
            <div class="right">
                <ul id="ul3">
                    
                </ul>
                <script type="text/html" id="list3">
                    {{each list item}}
                        <li>
                            <a href="/html/detail.html?id={{item.id}}"><img src="{{item.src}}" alt=""></a>
                            <p>{{item.title}}</p>
                            <span>￥{{item.price}}</span>
                        </li>
                    {{/each}}
                </script>
            </div>
        </div>
        <div class="div4">
            <div class="title">
                <h3>办公家电</h3>
                <a href="">大家电</a>
                <a href="">厨卫电器</a>
                <a href="">厨房小家电</a>
                <a href="">生活家电</a>
            </div>
            <div class="left"><img src="/images/list3.PNG" alt=""></div>
            <div class="right">
                <ul id="ul4">
                   
                </ul>
                <script type="text/html" id="list4">
                    {{each list item}}
                        <li>
                            <a href="/html/detail.html?id={{item.id}}"><img src="{{item.src}}" alt=""></a>
                            <p>{{item.title}}</p>
                            <span>￥{{item.price}}</span>
                        </li>
                    {{/each}}
                </script>
            </div>
        </div>
        <div class="div5">
            <div class="title">
                <h3>服务器/网络</h3>
                <a href="">台式整机</a>
                <a href="">笔记本</a>
                <a href="">数码产品</a>
            </div>
            <div class="left"><img src="/images/list4.PNG" alt=""></div>
            <div class="right">
                <ul id="ul5">
                
                </ul>
                <script type="text/html" id="list5">
                    {{each list item}}
                        <li>
                            <a href="/html/detail.html?id={{item.id}}"><img src="{{item.src}}" alt=""></a>
                            <p>{{item.title}}</p>
                            <span>￥{{item.price}}</span>
                        </li>
                    {{/each}}
                </script>
            </div>
        </div>
    </div>
</main>
<footer></footer>

<script src="/libs/require/require.min.js" data-main="/js/index"></script>

</body>
</html>